
<template>
  <div class="myinput">
    <testTable
      :head="headList"
      :data="dataList"
      @select="select"
      @selectedChange="selectedChange"
      @selectAll="selectAll"
      ref="ReftestTable"
    >
    </testTable>
    <!-- <el-input
      v-model.trim="data.keyWord"
      size="small"
      placeholder=""
    ></el-input> -->

    <!-- {{ plusOne }} -->

    <el-button type="primary" size="small" @click="getData">查询</el-button>
    <el-button type="primary" size="small" @click="opendialog"
      >打开弹框</el-button
    >

    <mydialog ref="mydialogRef" :getInfo="getInfo" :isShowClose="isShowClose" />

    <!-- <el-checkbox
      v-model="checked"
      true-label="1"
      false-label="0"
      label="启用"
      size="large"
      @change="changeChecked"
    /> -->

    <!-- <el-select
      v-model="value"
      placeholder="请选择"
      @change="changeSelect($event)"
    >
      <el-option
        v-for="item in options"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      >
      </el-option>
    </el-select> -->
  </div>
</template>



<script setup>
import testTable from "../components/testTable.vue";
import { reactive, ref, onMounted, watch, computed } from "vue";
import { ElMessage } from "element-plus";
// import service from "@/service/portraitMng/portraitMng";
// const _service = new service();

import mydialog from "./myDialog.vue";

const ReftestTable = ref(null);

const data = reactive({
  keyWord: 22,
  pageNum: "",
});

const headList = ref([
  {
    showIndex: true,
  },
  {
    selected: "true",
  },
  {
    label: "日期",
    prop: "update_time",
    width: "200px",
  },
  {
    label: "姓名",
    prop: "create_by",
    width: "200px",
  },
  {
    label: "地址",
    prop: "create_dept_name",
  },
  {
    label: "操作",
    slot: "btn",
  },
]);

const value = ref("");

const options = ref([
  {
    label: "选项1",
    value: "1",
  },
  {
    label: "选项2",
    value: "2",
  },
]);

const checked = ref(false);

const changeChecked = (val) => {
  console.log(val, "------", checked.value);
};

const select = (val, row) => {
  console.log(val, row);
  console.log(row.create_user_id);
  let a = val;
  console.log(a[0]);
};

const selectedChange = (val) => {
  console.log(val);
};

const selectAll = (val) => {
  console.log(val);
};

const dataList = ref([]);

function getData(params) {
  console.log(ReftestTable);

  console.log(ReftestTable.value.childString);

  ReftestTable.value.tsss();

  // console.log(data.keyWord);
  // testFnc();
  // dataList.pageNum = data.keyWord;
  // data.keyWord = data.keyWord + 1;

  ElMessage.success("成功提示");
}

const plusOne = computed(() => data.keyWord + 1);

const testFnc = () => {
  console.log("testFnc");
};

function changeSelect(val) {
  console.log("val------", val);
}

watch(
  () => data.keyWord,
  (val) => {
    console.log(val);
  }
);

watch(
  () => [data.keyWord, data.pageNum],
  ([val], [val1]) => {
    console.log(val, val1);
  }
);

// const selectSubjectFields = async (params) => {
//   let res = await _service.selectSubjectFields(params);

//   if (res.status) {
//     dataList.value = res.data.records;
//   } else {
//   }
// };

onMounted(() => {
  // selectSubjectFields({
  //   keyWord: "",
  //   pageNum: 1,
  //   pageSize: 10,
  // });

  dataList.value = [
    {
      id: 1,
      name: "1",
      update_time: "2020-01-01",
      create_by: "张三",
      create_dept_name: "江苏省",
    },
    {
      id: 2,
      name: "2",
    },
  ];
});

const mydialogRef = ref(null);

const bodyWidth = ref("1200px");
const bodyHeight = ref("600px");

const isShowClose = ref(false);
const opendialog = () => {
  mydialogRef.value.openDialog("edit");
};

const getInfo = () => {
  console.log("刷新列表数据");
};
</script>


<style scoped lang="scss">
.myinput {
  :deep(.el-input) {
    width: 300px;
  }
}
</style>
